<template>
	<!-- 创建编辑新考试 -->
	<div class="addExamMain">
		<div class="addExamContent">
			<h3>语文A-参试学校列表及联阅控制</h3>
			<ul>
                <li>
					<span>参加学校：</span>
					<div class="inputBox">
						<el-select v-model="addinfo.school" multiple placeholder="请选择" @change="changeSchool" filterable>
						  <el-option
							v-for="item in examclassify"
							:key="item.gradeid"
							:label="item.schoolname"
							:value="item.gradeid">
						  </el-option>
						</el-select>
					</div>
				</li>
			</ul>
            <el-table
                class="custom-table"
                ref="multipleTable"
                :data="stopexamlist"
                tooltip-effect="dark"
                style="width: 100%"
                stripe
                @selection-change="handleSelectionChange"
                :header-cell-style="{ background: '#D8E4F0', color: '#2A303B',fontWeight:'500' }">
                <el-table-column
                    type="selection"
                    width="55">
                </el-table-column>
                <el-table-column
                    prop="name"
                    label="序号"
					width="80">
                    <template slot-scope="scope">  
                        <span>{{ scope.$index + 1 }}</span>
                    </template>
                </el-table-column>
                <el-table-column
                    prop="schoolname"
                    label="学校名称">
                </el-table-column>
                <el-table-column
                    fixed="right"
                    label="操作"
                    align="center"
                    width="120">
                    <template slot-scope="scope">
                        <div style="display: flex;justify-content: center;" class="scopednr">
                            <b v-if="scope.row.subjectlyType==0" style="color:#165DFF;margin-left:12px;cursor: pointer;" @click="examlyswitch(scope.row)">联阅</b>
                            <b v-if="scope.row.subjectlyType==1" style="color:#D54941;margin-left:12px;cursor: pointer;" @click="notexamlyswitch(scope.row)">不联阅</b>
                            <b style="color:#D54941;margin-left:12px;cursor: pointer;" @click="deleteswitch(scope.row)">删除</b>
                        </div>
                    </template>
                </el-table-column>
            </el-table>
            <div class="elbuttonbox">
                <el-button @click="bactchdelete">批量删除</el-button>
                <!-- <el-button>保存</el-button> -->
                <el-button @click="goback">返回</el-button>
            </div>
		</div>
	</div>
</template>

<script>
import {
	getAllschoolSubject,
	getAllschoolSubjectNomark,
	getAllschooldeleteGroup,
	getSchoollist,
	addsubjectSchoolToNav6,
	deletesubjectSchoolToNav6
} from '../api/api.js'
	export default{
		props:['examobj','addexamtype','contenteditam'],
		data(){
			return{
                addinfo:{
                    name:'',
                    subject:'',
                    status:'',
                    model:'',
                    school:'',
                    ipname:''
                },
                filteredOptions: [],
                searchQuery: '',
                examclassify:[],
				stopexamlist:[],
				multipleSelection: [],
			}
		},
		mounted() {
			this.allschoollist()
			this.contentobj = JSON.parse(sessionStorage.getItem('examContent'))
			this.huoquxuexiaoclick()
			// console.info(this.contenteditam)
			// this.filteredOptions = [...this.examclassify]
		},
		methods:{
			changeSchool(val){
				console.info(this.contentobj)
				let obj={
					nav6id:this.contenteditam.nav6id,
					gradeids:this.addinfo.school
				}
				addsubjectSchoolToNav6(obj).then(res=>{
				    if(res.code==0){
				        this.allschoollist()
				    }else{
				        this.$message.error(res.msg)
				    }
				})
			},
			huoquxuexiaoclick(){
				let obj={
				    gradename:this.contentobj.gradename
				}
			    getSchoollist(obj).then(res=>{
			        if(res.code==0){
			        	this.examclassify = res.obj
			        }else{
			            this.$message.error(res.msg)
			        }
			    })
			},
			handleSelectionChange(val){
				this.multipleSelection = val;
			},
			// 获取所有缩小列表
			allschoollist(){
				let obj={
					nav6id:this.contenteditam.nav6id
				}
				getAllschoolSubject(obj).then(res=>{
					console.info('res',res)
					if(res.code==0){
						this.stopexamlist=res.obj
					}else{
						this.$message.error(res.msg)
					}
				})
			},
            goback(){
				this.$emit('addexamclickschool',false)
			},
			//联阅开关
			examlyswitch(row){
				let obj={
					nav6id:row.nav6id,
					gradeid:row.gradeid
				}
				getAllschoolSubjectNomark(obj).then(res=>{
				    if(res.code==0){
						this.allschoollist()
					}else{
						this.$message.error(res.msg)
					}
				})
			},
			// 不联阅开关
			notexamlyswitch(row){
				let obj={
					nav6id:row.nav6id,
					gradeid:row.gradeid
				}
				getAllschooldeleteGroup(obj).then(res=>{
				    if(res.code==0){
						this.allschoollist()
					}else{
						this.$message.error(res.msg)
					}
				})
			},
			// 删除
			deleteswitch(row){
				let obj={
					nav6id:row.nav6id,
					gradeids:[row.gradeid]
				}
				this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					this.$message({
						type: 'success',
						message: '删除成功!'
					});
					deletesubjectSchoolToNav6(obj).then(res=>{
						if(res.code==0){
							this.allschoollist()
						}else{
							this.$message.error(res.msg)
						}
					})
				}).catch(() => {
					this.$message({
						type: 'info',
						message: '已取消删除'
					});          
				});
			},
			// 保存
			save(){
				let obj={
				    
				}
			},
			//批量删除
			bactchdelete(){
				// console.info(this.multipleSelection)
				let ids = this.multipleSelection.map(item => item.gradeid)
			    let obj={
					nav6id:this.multipleSelection[0].nav6id,
					gradeids:ids
				}
				this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					this.$message({
						type: 'success',
						message: '删除成功!'
					});
					deletesubjectSchoolToNav6(obj).then(res=>{
						if(res.code==0){
							this.allschoollist()
						}else{
							this.$message.error(res.msg)
						}
					})
				}).catch(() => {
					this.$message({
						type: 'info',
						message: '已取消删除'
					});          
				});
			}
		}
	}
</script>

<style scoped>
	.addExamMain{
		position: fixed;
		width:100%;
		height:100%;
		background:rgba(0,0,0,0.5);
		left:0;
		top:0;
		z-index:100;
	}
	.addExamContent{
		width: 584px;
		height: auto;
		background: #FFFFFF;
		box-shadow: 0px 4px 16px 0px rgba(85,114,146,0.1);
		border-radius: 10px;
		position: fixed;
		left:50%;
		top:50%;
		transform: translate(-50%,-50%);
		z-index:2;
		box-sizing: border-box;
		padding:30px;
	}
	.addExamContent h3{
		font-size:18px;
		padding-bottom:20px;
	}
	.addExamContent ul li{
		display: flex;
		align-items: center;
		padding-bottom:14px;
		font-size:14px;
	}
	.addExamContent ul li span{
		font-size:14px;
		width:80px;
		color: #557292;
		text-align: right;
	}
	.addExamContent ul li p{
		position: relative;
	}
	.addExamContent ul li p em{
		position: absolute;
		right:10px;
		top:50%;
		transform: translateY(-50%);
		color:#C0C4CC;
		cursor: pointer;
	}
	.addExamContent ul li >>> .el-input__inner{
		width: 400px;
		height: 34px;
		border-radius: 10px;
		border: 1px solid #D8E4F0;
	}
	.addExamContent ul li >>> .el-input__icon{
	    line-height:34px;
	}
	.inputBox{
		width: 400px;
	}
	.inputBox1{
		width: 300px;
	}
	.addExamContent ul li div.inputBox1 >>> .el-input__inner{
		width:300px;
		height: 34px;
		border-radius: 10px;
		border: 1px solid #D8E4F0;
	}
	.addExamContent ul li >>> .el-range__icon{
		line-height:27px;
	}
	.groupbutton{
		display: flex;
		align-items: center;
		padding-top:20px;
	}
	.groupbutton >>> .el-button{
		width: 124px;
		height: 34px;
		background: #295CFF;
		border-radius: 10px;
		font-size: 14px;
		color: #FFFFFF;
		padding:0;
	}
	.groupbutton >>> .el-button:last-child{
		background: #F2F6FB;
		border-radius: 10px;
		border: 1px solid #295CFF;
		color:#295CFF;
		margin-left:24px;
	}
	.bcontentcolor{
		font-size:14px;
		color:#295CFF;
		display: inline-block;
		margin-left:20px;
		cursor: pointer;
	}
	.el-checkbox{
		margin-right:8px;
	}
	.infosetcontentfont{
		color:#5B6371
	}
	.addExamContent ul li.infosetcontentfont span{
		width:auto;
		height: 26px;
		border-radius: 4px;
		border: 1px solid #D8E4F0;
		color:#B3B8C2;
		font-size:14px;
		text-align:left;
		line-height:26px;
		padding:0 16px 0 10px;
		margin-left:10px;
	}
	.addExamContent ul li.infosetcontentfont i{
		font-style:normal;
		color:#295CFF;
		padding:0 4px;
	}
	.inputBox1 >>> .el-tag.el-tag--info{
		background: #F2F6FB;
		border: 1px solid #D8E4F0;
		color: #B3B8C2;
	}
	.inputBox1 >>> .el-select .el-tag__close.el-icon-close{
		background:none;
		color:#B3B8C2;
	}
    .inputBox >>> .distpicker-address-wrapper select{
		border-radius: 10px;
    	height: 35px;
		font-size: 16px;
		line-height: 35px;
		border: 1px solid #D8E4F0;
		color:#606266;
		padding:0 10px;
	}
    .custom-table {
	  width: 100%;
	  border: 1px solid rgba(216,228,240,0.34);
	  border-radius:10px;
	  border-right: none;
	  border-bottom:none;
	}
	
	/* 自定义表格内部元素的样式 */
	.custom-table >>> .el-table__header-wrapper th {
	  background-color: #E8F0FA;
	  height:42px;
	  padding:0;
	  text-align: center;
	  font-weight:normal
	}
	.custom-table >>> .el-table__row td {
	  height:42px;
	  padding:0;
	  text-align: center;
	  border-bottom:none;
	  border-right:solid 1px rgba(216,228,240,0.34);
	  font-size:14px;
	}
	.el-table .warning-row {
	    background: #ffffff;
	 }
	.el-table .success-row {
	    background: #D8E4F0;
	}
     .el-table .el-table__cell{
        padding:8px 0;
    }
	.elbuttonbox{
		padding-top:15px;
	}
	.elbuttonbox >>> .el-button{
	    background:#165DFF;
		height:36px;
		color:#fff;
		font-weight:normal;
		border:solid 1px #165DFF;
	}
	.elbuttonbox >>> .el-button:first-child{
		background:	#D54941;
		border:solid 1px #D54941;
	}
	.elbuttonbox >>> .el-table ,.elbuttonbox >>> .el-table__cell{
		padding:8px 0;
	}
</style>